<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: 22328
  Date: 2021/2/12
  Time: 21:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>焕耀商城－购物车</title>
    <link rel="stylesheet" type="text/css" href="./css/reset.css">
    <link rel="stylesheet" type="text/css" href="./css/main.css">
    <script type="text/javascript" src="./js/jquery-3.1.0.min.js"></script>

</head>
<body>
<jsp:include page="top.jsp"/>

<div class="search_bar clearfix">
    <a href="./main" class="logo fl"><img src="./images/logo.png"></a>
    <div class="sub_page_name fl">|&nbsp;&nbsp;&nbsp;&nbsp;购物车</div>
    <div class="search_con fr">
        <form method="get" action="" target="_blank">
            <input type="text" class="input_text fl" name="q" placeholder="搜索商品">
            <input type="submit" class="input_btn fr" value="搜索">
        </form>
    </div>
</div>

<div class="total_count">全部商品<em>${sessionScope.user.cartBuyNums}</em>件</div>
<ul class="cart_list_th clearfix">
    <li class="col01">商品名称</li>
    <li class="col02">商品单位</li>
    <li class="col03">商品单价</li>
    <li class="col04">数量</li>
    <li class="col05">小计</li>
    <li class="col06">操作</li>
</ul>

<c:forEach items="${cartList}" var="cart">
    <ul class="cart_list_td clearfix" id="${cart.id}">
        <li class="col01"><input type="checkbox" name="" checked=""></li>
        <li class="col02"><img src="${cart.goods.goodsImg}"></li>
        <li class="col03">${cart.goods.goodsName}<br></li>
        <li class="col04" name="buyNum" data-id="${cart.buyNum}">RMB:${cart.goods.goodsPrice}元/件</li>
        <li class="col05">${cart.goods.goodsPrice}</li>
        <li class="col06">
            <div class="num_add">
                <a href="javascript:void(0);" id="add_cart"  onclick="addCart(${cart.goods.id},${sessionScope.user.id})" class="add fl">+</a>
                <input type="text" class="num_show fl" value="${cart.buyNum}">
                <a href="javascript:void(0);" class="minus fl" onclick="delCart(${cart.goods.id},${sessionScope.user.id})">-</a>
                <span class="kucun" style="display: none">978</span>
                <span class="goodsid" style="display: none">44</span>
            </div>
        </li>
        <li class="col07">${cart.goods.goodsPrice*cart.buyNum}</li>
        <li class="col08"><a href="#" onclick="del(${cart.id})" >删除</a></li>
    </ul>
</c:forEach>

<ul class="settlements">
    <li class="col01"><input type="checkbox" id="check_all" name="" checked=""></li>
    <li class="col02">全选</li>
    <li class="col03">合计(不含运费)：<span>¥</span><em id="zong">365.90</em><br>共计<b id="zongshu"></b><input id="getTotalNum" value="3" style="background-color: #FFF4E8;width: 20px;border: none" />件商品</li>
    <li class="col04"><a href="javascript:;" id="jiesuan" style="background-color: rgb(255, 61, 61);">去结算</a></li>
</ul>

<jsp:include page="bottom.jsp"/>
</body>
<script type="text/javascript" src="./js/shop.js"></script>
<script>
    $(function () {
            var carts = document.getElementsByName("buyNum");
            //console.log(carts[0].getAttribute("data-id"));
            var num = 0;
            for (var i=0;i<carts.length;i++){
                num+=parseInt(carts[i].getAttribute("data-id"));
            }
            document.getElementById("getTotalNum").setAttribute("value",num);
    });

    function addCart(goodsId,id){
        var userId = id;
        var goodsId = goodsId;
        var buyNum = 1;
        $.ajax({
            url:"./addCart",
            type:"post",
            data:{
                userId:userId,
                goodsId:goodsId,
                buyNum:buyNum
            },
            success:function (res) {
                if (res.data === '添加成功'){
                    window.location.href = "./getCartHtml?userId=${sessionScope.user.id}"
                } else {
                    alert("添加失败");
                }
            },
            error:function () {
                alert("404.html页面");
            }
        });
    }

    function delCart(goodsId,id){
        var userId = id;
        var goodsId = goodsId;
        var buyNum = 1;
        $.ajax({
            url:"./delCart",
            type:"post",
            data:{
                userId:userId,
                goodsId:goodsId,
                buyNum:buyNum
            },
            success:function (res) {
                if (res.data === '操作成功'){
                    window.location.href = "./getCartHtml?userId=${sessionScope.user.id}"
                } else {
                    alert("操作失败");
                }
            },
            error:function () {
                alert("404.html页面");
            }
        });
    }

    $("#jiesuan").click(function () {
        if($("input[type='checkbox']:checked").not($("#check_all")).length <= 0){
            return false;
        }
        else{
            //alert(cart());
            $(this).attr("href",cart());
        }

    });

    function cart() {
        var url="/createOrders?";
        $("input[type='checkbox']:checked").not($("#check_all")).each(function (i) {
            url += "cart" + i + "=" + $(this).parents(".cart_list_td").attr("id") +"&";
        });
        return url;
    }

    function del(id) {
        // var id = obj.getAttribute("data-id");
        $.ajax({
            url:"./deleteCartById",
            type:"post",
            data:{id:id},
            success:function (res) {
                if (res.data === '删除成功'){
                    window.location.href="./getCartHtml?userId=${sessionScope.user.id}"
                } else {
                    alert("删除失败");
                }
            },
            error:function () {
                alert("404.html页面");
            }
        });
    }
</script>
</html>

